<template>
  <div class="personal">
    <div class="back" @touchend="backTouch"></div>
    <router-view></router-view>
  </div>
</template>

<script>
import { mapGetters, mapActions } from "vuex"
export default {
  created() {
    this.loadMastery()
  },
  computed: {
    ...mapGetters("seedActivityStatus", {
      isResulteShow: "getIsResulteShow",
    })
  },
  methods: {
    //用户评测结果
    loadMastery: async function () {
      const json = {
        deviceUuid: this.deviceUuid,
        isInSeedActivity: this.isResulteShow                 // 如果为 false，表示是普通模式
      }
      const [data, err] = await this.awaitWarp(this.$post(this.api.loadMastery, json))
      if (data) {
        this.setUserMastery(data.mastery)
        this.studyExplain(data.abilityAndExplainationMap)
      }
    },
    //点击返回列表
    backTouch: function () {
      this.touchMusic()
      this.setLoading({
        callback: () => {
          this.$router.go(-1)
        }
      })
    },
    ...mapActions("personalStatus", ["setUserMastery", "studyExplain"]),
    ...mapActions("mainStatus", ["setLoading"])
  }
}
</script>

<style lang="stylus" scoped>.personal
  position absolute
  width 100%
  height 100%
  background url($urlTitle + 'personals/背景.png') 0 0 / 100% 100%
  .back
    z-index 99
    transform translate3d(calc(0px - var(--X)), calc(0px - var(--Y)), 0)
    background url($urlTitle + 'icon/icon-返回.png') 0 0 / 100% 100%
    $coord('WHLT', 11vh, 10.8vh, 2rem, 1rem)
</style>
